<template>
  <div id="app">
    <router-view></router-view>
  </div>
</template>

<style lang="less">
body {
  width: 100%;
  height: 100%;
  /* 调整弹窗的关闭按钮位置 */
  .el-dialog__headerbtn {
    top: 14px;
  }
  /* 去掉操作栏的三角箭头 */
  .avue-crud__menu {
    & > div button {
      transform: rotate(90deg);
      & > span > i {
        display: none;
      }
    }
  }
}
#app {
  width: 100%;
  height: 100%;
  font-size: 16px;

  // 全局配置滚动条样式
  // 设置滚动条轨道和滑块的宽度(两者只能同宽)
  ::-webkit-scrollbar {
    width: 6px; /*滚动条宽度*/
    height: 6px; /*滚动条高度*/
  }

  /*正常情况下滚动条滑块*/
  ::-webkit-scrollbar-thumb {
    background-color: #eff0f1;
    border-radius: 6px;
    -webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.1);
  }

  /*正常时候的滚动条轨道*/
  ::-webkit-scrollbar-track {
    border-radius: 6px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
    background-color: white;
  }

  // /*鼠标悬浮在盒子上时滚动条滑块的样式*/
  // :hover::-webkit-scrollbar-thumb {
  //   background-color: rgba(0, 0, 0, 0.2);
  //   border-radius: 6px;
  //   -webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.1);
  // }

  // /*鼠标悬浮在盒子上时滚动条轨道的样式*/
  // :hover::-webkit-scrollbar-track {
  //   background-color: white;
  //   border-radius: 6px;
  //   -webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.1);
  // }

  // /*鼠标悬浮在滚动条滑块上时滑块的样式*/
  // ::-webkit-scrollbar-thumb:hover {
  //   background-color: rgba(0, 0, 0, 0.4);
  //   -webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.1);
  // }

  // /*鼠标悬浮在滚动条轨道上时轨道的样式*/
  // ::-webkit-scrollbar-track:hover {
  //   -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.4);
  //   background-color: rgba(0, 0, 0, 0.01);
  // }
}
</style>